<template>
  <div class="addModal">
    <div style="height: 600px">
      <FilterTable
        ref="table"
        :columns="columns"
        height="auto"
        :dataSource="dataSource"
        :onCellChange="onCellChange"
        :onRowSelectChange="selectChange"
        :isSelectColumn="true"
        :onColumnsChange="columns => this.columns = columns"
        >
        </FilterTable>
        <div class="dialogBottmView" 
        :style="{position: 'absolute',
        left: 0,
        bottom: 0,
        right: 0,
        zIndex: 20,
        borderTop: '1px solid #e9e9e9',
        padding: '10px 20px',
        background: '#fff',
        textAlign: 'right'}">
            <el-button @click="closeDialog">取 消</el-button>
            <el-button @click="saveDialog" type="primary">确定</el-button>
        </div>
    </div>
  </div>
</template>

<script>
import { dictionary } from '@/utils/dictMixin';
import { getDealerCompanyByCode} from "@/api/common/org/dealerCompany";
import {getChildOrgdetail,getOrgBrand,getOrgSeries} from '@/api/common/org/companyOrgManage'


export default {
  name: 'addModal',
  mixins: [dictionary],
  props: {
    rowData: {
      type: Object,
      default: () => ({})
    },
    addParams:{},
    parentOrgId:String|Number,
  },
  data() {
    this.saveData = null;
    return {
        visible: false,
        columns: this.createTableColumns(),
        dataSource:[],
        params:{
            orgId:this.parentOrgId,
            type:10041002,
        },
        BrandData:{
            orgId:0
        },
        SeriesData:{
            orgId:0,
            brandId:''
        },
        selectedRows:null,
    };
  },
  mounted () {
    this.getOrgdetail()
    this.initTableData()
  },
  methods: {
    createTableColumns() {
        return [
                {
                    title: '序号',
                    dataIndex: 'index',
                    width: 80,
                    sorter: true,
                    render: props => {
                        return <span>{props.row.index + 1}</span>;
                    }
                },
                {
                    title: '授权类型',
                    dataIndex: 'billType',
                    sorter: true,
                    filterType: 'input',
                    filterItems: [],
                    editable: false,
                    editType: 'select',
                    editItems: this.createDictList('7040')
                },
                {
                    title: '授权品牌',
                    dataIndex: 'brandName',
                    sorter: true,
                    filterType: 'input',
                    filterItems: [],
                    editable: false,
                    editType: 'select',
                    editItems: []
                },
                {
                    title: '授权车系',
                    dataIndex: 'seriesName',
                    sorter: true,
                    filterType: 'input',
                    filterItems: [],
                    editable: false,
                    editType: 'select',
                    editItems: []
                }
            ];
    },
    // 获取授权类型/品牌/车系
        async getOrgdetail(){
            let that=this
            // this.addParams
            await getChildOrgdetail(this.params).then((res)=>{
                console.log(res.data.listOBSVO,"add")
                this.dataSource=res.data.listOBSVO
                // that.formList.forEach(x=>{
                //     x.initialValue=res.data[x.fieldName];
                // })
            }).catch(err=>{})
            // that.getBrandAndSeries()
        },

        /* getBrandAndSeries(){
             //品牌
            this.BrandData.orgId=0
            this.columns[2].editItems=[]
            this.columns[3].editItems=[]
            getOrgBrand(this.BrandData).then((OrgBrand)=>{
                // console.log(OrgBrand,'OrgBrand')
                OrgBrand.data.forEach(x=>{
                    this.columns[2].editItems.push({'text':x.brandName,'value':x.brandId})
                })
            }).catch(err=>{})

            // 车系
            // console.log(this.dataSource,"this.dataSource")
            this.SeriesData.orgId=0
            this.dataSource.forEach(x=>{
                this.SeriesData.brandId=x.seriesId
            })
            getOrgSeries(this.SeriesData).then((res)=>{
                // console.log(res,'SeriesData')
                res.data.forEach(x=>{
                    this.columns[3].editItems.push({'text':x.seriesName,'value':x.seriesId})
                })
            }).catch(err=>{})
        }, */

    //initTableData
    initTableData(){
        this.dataSource.forEach(ele=>{
            if(ele.type == 2){
                ele.type2=''
                this.columns[3].editable=false
            }
        })
    },
    //表格数据变化时
    onCellChange(val,val2){
        console.log(val,val2,"val")
            console.log(val[Object.keys(val)[0]],"修改后对应的编码")
            if(val[Object.keys(val)[0]] == val2.brandId){
                this.SeriesData.brandId=val2.brandId
                getOrgSeries(this.SeriesData).then((res)=>{
                    console.log(res,'SeriesData')
                    res.data.forEach(x=>{
                        this.columns[3].editItems.push({'text':x.seriesName,'value':x.seriesId})
                    })
                }).catch(err=>{})
            }
    },
    //选中
    selectChange(rows) {
      this.selectedRows = rows
      console.log(this.selectedRows);
    },
    //保存
    saveDialog() {
      this.$emit('close', this.selectedRows);
    },
    //取消操作
    closeDialog() {
      this.$emit('close' );
    }
  }

};
</script>
<style lang="less" >
.addModal{
    .el-select{
        width: 100%;
    }
}
</style>